@import 'mixin.scss';
@import 'color.scss';
.swiper-integral-container {
    .swiper-slide {
        padding-bottom: 45%;
    }
}

.jifen-warp {
    padding: rem(24px) 0;
    background-color: $color-white;
    a {
        @include flex;
        font-size: rem(32px);
        line-height: rem(32px);
        text-align: center;
        &:first-child {
            border-right: 1px $border-color-DCDCDC solid;
        }
        &:last-child {
            color: $color-ff1969
        }
    }
}

.fefen-nav {
    margin-top: rem(25px);
    padding: rem(25px) 0;
    background-color: $color-white;
    li {
        @include flex;
        font-size: rem(24px);
        text-align: center;
        &::before {
            content: '';
            display: block;
            margin: 0 auto rem(15px);
            width: rem(94px);
            height: rem(94px);
            background: url(../images/im_icons.png) no-repeat;
            background-size: rem(94px) rem(288px);
        }
        &.icon2 {
            &::before {
                background-position: 0 rem(-94px);
            }
        }
        &.icon3 {
            &::before {
                background-position: 0 rem(-190px);
            }
        }
    }
}

.integral {
    &-list {
        &-title {
            padding: rem(20px) 0;
            margin-top: rem(27px);
            font-size: rem(28px);
            line-height: rem(28px);
            color: #ff2731;
            text-align: center;
            .icon {
                content: '';
                display: block;
                width: rem(46px);
                height: rem(7px);
                background: url(../images/im_column_title_icons.png) no-repeat;
                background-size: rem(46px) rem(16px);
            }
            .icon-left {
                margin-right: rem(15px);
                background-position: 0 0;
            }
            .icon-right {
                margin-left: rem(15px);
                background-position: 0 rem(-9px);
            }
        }
    }
    &-col {
        padding: rem(25px) rem(10px);
        background-color: $color-white;
        &-title {
            padding: 0 rem(10px) rem(25px);
            span {
                @include flex;
                font-size: rem(26px);
                font-weight: bold;
            }
            a {
                font-size: rem(24px);
                line-height: rem(24px);
                color: #aaa;
            }
        }
        li {
            width: 33.333%;
            .jifen-price {
                padding-top: rem(15px);
                font-size: rem(26px);
                color: #ff2731;
            }
            img.thumbs {
                width: rem(220px);
                height: rem(220px);
                border: 1px #ccc solid;
            }
            .jf-icon {
                display: inline-block;
                margin-right: rem(2px);
                width: rem(20px);
                height: rem(20px);
            }
        }
    }
}